<template>
<button @click="showComponent = MyLeft">show Component named MyLeft</button>
<button @click="showComponent = MyRight"> show Component named MyRight</button>
<div>
    <KeepAlive include="MyLeft">
        <component :is="showComponent"></component>
    </KeepAlive>

</div>
</template>

<script setup>
import MyLeft from './MyLeft.vue';
import MyRight from './MyRight.vue';
import {
    shallowRef
} from 'vue'; //import shallowRef
const showComponent = shallowRef(MyLeft); //default component
</script>
